<template>
    <view class="page">
        <view class="cardsale-box">
            <view class="phone-box">手机号码：</view>
            <view class="input-phonebox">
                <input class="input-phone" maxlength="11" @input="blurPhone" value="" placeholder="请输入顾客手机号码" placeholder-class="placeholder-style" type="text" />
                <button class="inquire" @tap="searchList" :disabled="isDisabled">查询</button>
            </view>

            <view class="phone-hint" v-if="ishint">输入正确手机号</view>
        </view>

        <view class="cardsale-conter">
            <view class="cardsale-contermax">
                <view class="cardsale-title">
                    <view class="title-name1">小意助手</view>
                    <view class="title-name2">最近一周查询过的号码：</view>
                </view>
                <view class="cardsales-max" v-for="(item, index) in WeeksMobileList" :key="index">
                    <view class="mybkkdbox">
                        <view class="mybkkd"></view>
                        <view class="mybkkd-lt">
                            <view class="mybkkd-time">
                                {{ item.updatetime }}
                            </view>
                            <view class="mybkkd-name">
                                <text>{{ item.mobile }} {{ item.memberName }}</text>
                            </view>
                        </view>
                    </view>

                    <view class="to-cardsale" :data-mobile="item.mobile" :data-memberid="item.memberId" @tap="tocardsale">
                        {{ btn_text }}
                    </view>
                </view>
            </view>
        </view>
    </view>
</template>

<script>
// pagesc/cardsale/index.js
const app = getApp(); // 引入app

const _request = require('../../utils/request.js');

export default {
    data() {
        return {
            phone: '',
            btn_text: '去开卡',
            type: 1,

            //1去开卡
            memberStatus: '',

            shopId: '',
            isNaa: false,
            memberList: [],
            serviceCards: [],
            WeeksMobileList: [],
            isDisabled: true,
            ajxtrue: false,
            ishint: false,
            memberid: ''
        };
    }
    /**
     * 生命周期函数--监听页面加载
     */,
    onLoad(o) {
        if (o.shopId) {
            this.setData({
                shopId: o.shopId
            });
        }

        this.setData({
            type: Number(o.type)
        });

        if (Number(o.type) == 4) {
            this.setData({
                btn_text: '去开创客'
            });
            uni.setNavigationBarTitle({
                title: '去开创客'
            });
        }

        if (Number(o.type) == 3) {
            this.setData({
                btn_text: '选择'
            });
            uni.setNavigationBarTitle({
                title: '会员收银'
            });
        }

        if (Number(o.type) == 2) {
            this.setData({
                btn_text: '去充值'
            });
            uni.setNavigationBarTitle({
                title: '会员充值'
            });
        }

        this.getWeeksMobile();
    },
    onShow() {
        this.getWeeksMobile();
        this.setData({
            memberStatus: '',
            isNaa: false
        });
    },
    methods: {
        searchList() {
            const { phone } = this;
            this.getMemberByMobile(phone);
            setTimeout(() => {
                const { memberStatus, serviceCards, phone, memberList, memberid } = this;
                let memberLists = JSON.stringify(memberList);
                let serviceCard = JSON.stringify(serviceCards);

                if (this.type == 3 && memberStatus == 1) {
                    uni.navigateTo({
                        url:
                            '/pagesc/ordercashier/ordercashier?type=2&memberStatus=' +
                            memberStatus +
                            '&phone=' +
                            phone +
                            '&shopId=' +
                            uni.getStorageSync('shopId') +
                            '&memberList=' +
                            memberLists +
                            '&serviceCard=' +
                            serviceCard +
                            '&memberid=' +
                            memberid
                    });
                } else {
                    uni.navigateTo({
                        url:
                            '/pagesc/opencard/index?type=' +
                            this.type +
                            '&memberStatus=' +
                            memberStatus +
                            '&serviceCard=' +
                            serviceCard +
                            '&phone=' +
                            phone +
                            '&memberList=' +
                            memberLists +
                            '&memberid=' +
                            memberid
                    });
                }
            }, 500);
        },

        // 手机号验证
        blurPhone: function (e) {
            var phone = e.detail.value;
            console.log('a', phone, this.isDisabled);
            let that = this;

            if (!/^1[345678]\d{9}$/.test(phone)) {
                this.setData({
                    ajxtrue: false,
                    ishint: true,
                    phone: phone,
                    isDisabled: true
                });

                if (phone == '') {
                    this.setData({
                        ishint: false,
                        isDisabled: true
                    });
                }

                if (phone.length >= 11) {
                    this.setData({
                        ajxtrue: false,
                        ishint: true,
                        phone: phone,
                        isDisabled: true
                    });
                }
            } else {
                this.setData({
                    ajxtrue: true,
                    ishint: false,
                    phone: phone,
                    isDisabled: false
                });
            }
        },

        // 查询最近一周查询过的号码
        getWeeksMobile() {
            _request
                .get('/cashier/getWeeksMobile', {
                    shopId: uni.getStorageSync('shopId')
                })
                .then((res) => {
                    if (res.data.code == 200) {
                        this.setData({
                            WeeksMobileList: res.data.data
                        });
                        console.log('1', res);
                    }
                })
                .catch((error) => {
                    console.log(error, 'error');
                });
        },

        // 根据手机号码查询会员
        getMemberByMobile(phone) {
            _request
                .get('/cashier/getMemberByMobile', {
                    shopId: uni.getStorageSync('shopId'),
                    mobile: phone
                })
                .then((res) => {
                    if (res.data.code == 200) {
                        // this.getWeeksMobile()
                        let obj = res.data.data;
                        obj instanceof Object;

                        if (obj instanceof Object == false) {
                            uni.showToast({
                                title: res.data.data,
                                icon: 'none'
                            });
                        }

                        console.log('obj instanceof Object', obj instanceof Object);

                        if (obj instanceof Object && res.data.code == 200) {
                            this.setData({
                                isNaa: true
                            });
                        }

                        console.log('3', res);
                        this.setData({
                            memberStatus: res.data.data.memberStatus,
                            memberList: res.data.data,
                            memberid: res.data.data.memberId,
                            serviceCards: res.data.data.serviceCards.map((ele) => {
                                ele.expiration = ele.expiration.replace('T', ' ');
                                return ele;
                            })
                        });
                    }
                })
                .catch((error) => {
                    console.log(error, 'error');
                });
        },

        //去开卡
        tocardsale(e) {
            console.log('e', e);
            let phone = e.currentTarget.dataset.mobile;
            let memberid = e.currentTarget.dataset.memberid;
            this.getMemberByMobile(phone);
            setTimeout(() => {
                if (this.isNaa == false) {
                }
            }, 500);
            setTimeout(() => {
                const { memberList, serviceCards, type } = this;
                let memberLists = JSON.stringify(memberList);
                let serviceCard = JSON.stringify(serviceCards);

                if (this.isNaa == true) {
                    if (this.type == 3) {
                        uni.navigateTo({
                            url:
                                '/pagesc/ordercashier/ordercashier?type=2&memberStatus=' +
                                this.memberStatus +
                                '&phone=' +
                                phone +
                                '&shopId=' +
                                uni.getStorageSync('shopId') +
                                '&memberList=' +
                                memberLists +
                                '&serviceCard=' +
                                serviceCard +
                                '&memberid=' +
                                memberid
                        });
                    } else {
                        uni.navigateTo({
                            url:
                                '/pagesc/opencard/index?memberStatus=' +
                                this.memberStatus +
                                '&phone=' +
                                phone +
                                '&shopId=' +
                                uni.getStorageSync('shopId') +
                                '&memberList=' +
                                memberLists +
                                '&serviceCard=' +
                                serviceCard +
                                '&memberid=' +
                                memberid +
                                '&type=' +
                                type
                        });
                    }
                }
            }, 500);
        }
    }
};
</script>
<style>
/* pagesc/cardsale/index.wxss */
.page {
    overflow-x: hidden;
}
.cardsale-box {
    background-image: url('https://yiyue-store-applet.oss-cn-shenzhen.aliyuncs.com/cardsale_banner.png');
    width: 100%;
    height: 330rpx;
    padding: 0rpx 20rpx;
    background-size: 100% 100%;
}

.phone-box {
    height: 100rpx;
    line-height: 120rpx;
    font-size: 26rpx;
    font-family: Adobe Heiti Std;
    font-weight: normal;
    color: #ffffff;
}

.input-phone {
    width: 580rpx;
    height: 80rpx;
    color: #ffffff;
    border-radius: 40rpx;
    font-size: 30rpx;
    font-family: Adobe Heiti Std;
    font-weight: normal;
    display: flex;
    align-items: center;
}

.placeholder-style {
    color: #ffffff !important;
}

.inquire {
    text-align: center;
    width: 130rpx;
    height: 60rpx;
    line-height: 60rpx;
    background: #ffffff;
    box-shadow: 0rpx 6rpx 14rpx 0rpx rgba(233, 74, 24, 0.16);
    border-radius: 30rpx;
    font-size: 30rpx;
    font-family: Adobe Heiti Std;
    font-weight: normal;
    color: #e94a18;
    margin-right: 10rpx;
}

.cardsale-conter {
    width: 100%;
    /* height: 874rpx; */
    background: #ffffff;
    border-radius: 20rpx 20rpx 0rpx 0rpx;
    margin-top: -20rpx;
}
.cardsale-contermax {
    padding: 0rpx 20rpx;
}

.cardsale-title {
    height: 90rpx;
    line-height: 90rpx;
    display: flex;
    align-items: flex-end;
}

.title-name1 {
    font-size: 30rpx;
    font-family: Adobe Heiti Std;
    font-weight: normal;
    color: #e94a18;
}

.title-name2 {
    font-size: 30rpx;
    font-family: Adobe Heiti Std;
    font-weight: normal;
    color: #333333;
    margin-left: 20rpx;
}

.cardsales-max {
    width: 710rpx;
    height: 126rpx;
    background: #ffffff;
    box-shadow: 0rpx 2rpx 20rpx 0rpx rgba(242, 93, 3, 0.16);
    border-radius: 10rpx;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 30rpx;
}

.mybkkdbox {
    display: flex;
}

.mybkkd {
    text-align: center;
    writing-mode: vertical-lr;
    display: block;
    background-color: #e94a18;
    font-size: 24rpx;
    font-family: Source Han Sans CN;
    font-weight: 400;
    color: #ffffff;
    width: 6rpx;
    height: 126rpx;
    background: #e94a18;
    border-radius: 10rpx;
}

.mybkkd-lt {
    margin-left: 36rpx;
    height: 75rpx;
    margin-top: 15rpx;
}

.mybkkd-time {
    font-size: 26rpx;
    font-family: Adobe Heiti Std;
    font-weight: normal;
    color: #666666;
}

.mybkkd-name {
    font-size: 28rpx;
    font-family: Adobe Heiti Std;
    font-weight: normal;
    color: #333333;
    margin-top: 15rpx;
}

.to-cardsale {
    width: 140rpx;
    text-align: center;
    line-height: 60rpx;
    height: 60rpx;
    background: #e94a18;
    border-radius: 30rpx;
    font-size: 26rpx;
    font-family: Adobe Heiti Std;
    font-weight: normal;
    color: #ffffff;
    margin-right: 20rpx;
}

.phone-hint {
    color: #ffffff;
    font-size: 24rpx;
}
.input-phonebox {
    width: 680rpx;
    height: 80rpx;
    color: #ffffff;
    background-color: rgba(255, 255, 255, 0.4);
    box-shadow: 0rpx 10rpx 20rpx 0rpx rgba(233, 74, 24, 0.2);
    border-radius: 40rpx;
    font-size: 30rpx;
    font-family: Adobe Heiti Std;
    font-weight: normal;
    display: flex;
    padding-left: 30rpx;
    align-items: center;
}
</style>
